<script setup lang="ts">
import { EnumOpType } from "@renderer/assets/types";
import GroupBtnWithDropdown from "@renderer/view/components/components/GroupBtnWithDropdown.vue";

const exportMenus = [
  {
    label: '导出图片',
    value: 'exportPng',
    icon: 'mdi-image-area'
  },
  {
    label: '导出视频',
    value: 'exportVideo',
    icon: 'mdi-youtube'
  },
];

const handleChooseMenu = (item) => {

}
</script>

<template>
  <group-btn-with-dropdown
    :disabled="true"
    tips="window"
    :op-type="{
      type: EnumOpType.export,
      subType: ''
    }"
    icon="mdi-export-variant">
    <template #dropdownSlot>
      <v-list density="compact">
        <v-list-item
          v-for="(item, index) in exportMenus"
          :key="index"
          :value="index"
          @click="handleChooseMenu(item)"
        >
          <template v-slot:prepend>
            <v-icon :icon="item.icon"></v-icon>
          </template>

          <v-list-item-title  v-text="item.label">

          </v-list-item-title>
        </v-list-item>
      </v-list>
    </template>
  </group-btn-with-dropdown>
</template>

<style scoped>

</style>
